<template>
  <div>
    <el-dialog
        title="今日订单"
        :visible.sync="dialogVisible"
        width="60%"
        :before-close="handleClose">
      <el-table
          :data="tableData"
          style="width: 100%">
        <el-table-column
            prop="code"
            label="订单编号"
            align="center">
        </el-table-column>
        <el-table-column
            prop="merchantAddress"
            label="商家地址"
            align="center">
        </el-table-column>
        <el-table-column
            prop="customerAddress"
            label="客户地址"
            align="center">
        </el-table-column>
        <el-table-column
            prop="income"
            label="本单佣金"
            align="center">
        </el-table-column>
        <el-table-column
            prop="endTime"
            label="送达时间"
            align="center">
        </el-table-column>
      </el-table>
      <el-button type="primary" @click="dialogVisible = false">返回</el-button>
    </el-dialog>

    <el-dialog
        title="我的账户"
        :visible.sync="showMy"
        width="30%"
        :before-close="handleClose">
      <el-table
          :data="myData"
          style="width: 100%">
        <el-table-column
            prop="sumIncome"
            label="总收入"
            align="center">
        </el-table-column>
        <el-table-column
            prop="todayIncome"
            label="今日收入"
            align="center">
        </el-table-column>
        <el-table-column
            prop="balance"
            label="账户余额"
            align="center">
        </el-table-column>
      </el-table>
      <el-button type="primary" @click="showMy = false">返回</el-button>
    </el-dialog>

    <el-dialog
        title="历史订单"
        :visible.sync="showHistory"
        width="60%"
        :before-close="handleClose">
      <el-table
          :data="historyData"
          highlight-current-row
          @current-change="handleCurrentChang"
          style="width: 100%">
        <el-table-column
            prop="code"
            label="订单编号"
            align="center">
        </el-table-column>
        <el-table-column
            prop="endTime"
            label="送达时间"
            align="center">
        </el-table-column>
        <el-table-column
            prop="income"
            label="本单佣金"
            align="center">
        </el-table-column>
        <el-table-column
            prop="userRating"
            label="用户评分"
            align="center">
          <template slot-scope="scope">
            <el-rate
                v-model="scope.row.userRating"
                disabled
                show-score
                text-color="#ff9900"
                score-template="{value}分">
            </el-rate>
          </template>
        </el-table-column>
      </el-table>
      <el-button type="primary" @click="showHistory = false">返回</el-button>
      <el-button type="primary" @click="findProduct">查询</el-button>
    </el-dialog>

    <el-dialog
        title="修改电话"
        :visible.sync="showPhone"
        width="30%"
        :before-close="handleClose">
      当前电话：<el-input
        v-model="currentCall"
        :disabled="true">
    </el-input>
      新电话：<el-input
        placeholder="请输入新电话"
        v-model="newCall"
        clearable>
    </el-input>

      <el-button type="primary" @click="update">提交</el-button>
    </el-dialog>

    <el-dialog
        title="提现"
        :visible.sync="showMoney"
        width="30%"
        :before-close="handleClose">
      当前余额：<el-input
        v-model="over"
        :disabled="true">
    </el-input>
      提现金额：<el-input
        placeholder="请输入提现金额"
        v-model="newOver"
        clearable>
    </el-input>
      <el-button type="primary" @click="updateMoney">提现</el-button>
    </el-dialog>

    <el-dialog
        title="订单详情"
        :visible.sync="dialogVisible1"
        width="60%"
        :before-close="handleClose">
      <h3>商品清单</h3>
      <el-table
          :data="productData"
          style="width: 100%">
        <el-table-column
            prop="productName"
            label="商品名"
            align="center">
        </el-table-column>
        <el-table-column
            prop="productNum"
            label="商品数量"
            align="center">
        </el-table-column>
        <el-table-column
            prop="productSumPrice"
            label="价格"
            align="center"
            :formatter="formats">
        </el-table-column>
      </el-table>
      <h3>商品总价：{{ price }}</h3>
      <h3>订单备注：{{ orderNotes }}</h3>
      <h3>订单编号：{{ code }}</h3>
      <el-button type="primary" @click="dialogVisible1 = false">返回</el-button>
    </el-dialog>


    <el-dialog
        title="提现详情"
        :visible.sync="dialogVisible2"
        width="60%"
        height="250"
        :before-close="handleClose">
      <el-table
          :data="moneyData"
          style="width: 100%">
        <el-table-column
            prop="daytime"
            label="提现日期"
            align="center">
        </el-table-column>
        <el-table-column
            prop="balance"
            label="提现前余额"
            align="center">
        </el-table-column>
        <el-table-column
            prop="getmoney"
            label="提现金额"
            align="center">
        </el-table-column>
      </el-table>
      <el-button type="primary" @click="dialogVisible2 = false">返回</el-button>
    </el-dialog>


    <el-row>
      <el-col :span="24">
        <div class="grid-content bg-purple-dark">
          <el-avatar src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png" :size="80"></el-avatar>
          <h3 style="margin-right: 30px">用户名：{{ userName }}</h3>
        </div>
      </el-col>
    </el-row>

    <div>
      <el-rate
          v-model="value1"
          disabled
          show-score
          text-color="#ff9900"
          score-template="{value}分">
      </el-rate>
    </div>
    <div>
      <h3>余额：{{currentBalance}}</h3>
    </div>

    <div>
      <el-button type="text" @click="showTwo" style="font-size: 18px;margin-top: 10px">我的账户</el-button>
      <el-button type="text" @click="showThree" style="font-size: 18px;margin-top: 10px">历史订单</el-button>
      <el-button type="text" @click="showFour" style="font-size: 18px;margin-top: 10px">修改电话号码</el-button>
      <el-button type="text" @click="showFive" style="font-size: 18px;margin-top: 10px">提现</el-button>
    </div>

    <div style="display: flex;justify-content: center">
      <div style="margin-right: 35px">
        <el-button type="text" @click="showOne" style="font-size: 18px;margin-top: 10px">今日完成单</el-button>
        <h3>{{ todayOne }}</h3>
      </div>
      <div style="margin-left: 35px">
        <el-button type="text" @click="showSix" style="font-size: 18px;margin-top: 10px">今日收入</el-button>
        <h3 style="margin-top: 30px">{{ todayMoney }}</h3>
      </div>
    </div>
    <el-link type="primary" style="margin-left: 20px;font-size: 20px" href="/">返回订单页面</el-link>
  </div>
</template>

<script>
export default {
  name: "PersonalCenter",
  data() {
    return {
      dialogVisible: false,
      dialogVisible1:false,
      showMy: false,
      showHistory: false,
      showPhone:false,
      showMoney:false,
      dialogVisible2:false,
      tableData: [],
      myData: [],
      historyData: [],
      productData:[],
      moneyData:[],
      userName: 'xx',
      value1:0,
      todayMoney: 0,
      todayOne: 0,
      currentBalance:0,
      riderCode: '6F8DDNHV0400',
      gettime: "",
      currentCall:'',
      newCall:'',
      over:'',
      newOver:'',
      code:'',
      orderNotes:'',
      price:''
    };
  },
  mounted() {
    setInterval(this.init(), 1000);
  },
  methods: {
    time() {
      let yy = new Date().getFullYear();
      let mm = new Date().getMonth() + 1;
      let dd = new Date().getDate();
      let hh = new Date().getHours();
      let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes();
      let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds();
      this.gettime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss;
    },
    init() {
      this.time()
      this.$axios.get("riderApi/rider/checkRider/"+this.riderCode).then(
          r=>{
            //用户名
            this.userName = r.data.name
            //骑手评分
            this.value1 = r.data.level
            //当前骑手电话
            this.currentCall = r.data.tel
            //当前骑手余额
            this.currentBalance = r.data.balance
          }
      )
      this.axios.get("riderApi/rider/checkRiderInformation/" + this.riderCode + "/" + this.gettime).then(
          r => {
            console.log(r.data)
            if (r.data != '') {
              //今日完成送单量
              this.todayOne = r.data.todayOrderNum
              //今日收入
              this.todayMoney = r.data.todayIncome
            }else {
              //今日完成送单量
              this.todayOne = 0
              //今日收入
              this.todayMoney = 0
            }
          }
      )
    },
    showOne() {
      this.time()
      this.$axios.get("riderApi/rider/checkTodayOrderDetail/" + this.riderCode + "/" + this.gettime).then(
          r => {
            this.tableData = r.data
            this.dialogVisible = true
          }
      )
    },
    showTwo() {
      let data = []
      let yy = new Date().getFullYear();
      let mm = new Date().getMonth() + 1;
      let dd = new Date().getDate();
      let time = yy + '-' + mm + '-' + dd + ' 00:00:00';
      this.time()
      this.$axios.get("riderApi/rider/checkRiderAccount/" + this.riderCode + "/" + time + "/" + this.gettime).then(
          r => {
            data = [r.data]
            this.myData = data
            this.showMy = true
          }
      )
    },
    showThree() {
      this.$axios.get("riderApi/rider/checkRiderHistoricalOrder/"+this.riderCode).then(
          r=>{
            this.historyData=r.data
            this.showHistory = true
          }
      )
    },
    handleClose() {
      this.dialogVisible = false
      this.showMy = false
      this.showHistory = false
      this.showPhone = false
      this.dialogVisible1 = false
      this.showMoney = false
      this.dialogVisible2 = false
    },
    showFour(){
      this.showPhone = true
      this.newCall = ''

      this.$axios.get("riderApi/rider/checkRider/"+this.riderCode).then(
          r=>{
            //当前骑手电话
            this.currentCall = r.data.tel
          }
      )
    },
    update(){
      let rex = /^1[35789]\d{9}$/
      if(rex.test(this.newCall) == false){
        this.$message.error("请输入13,15,17,18,19开头的11位数")
        this.newCall = ''
      }else {
        this.$axios.post("riderApi/rider/updatePhone/"+this.riderCode+"/"+this.newCall).then(
            r =>{
              this.$message(r.data.detail)
              this.showPhone = false
            }
        )
      }
    },
    showFive(){
      this.showMoney = true
      this.newOver = ''

      this.$axios.get("riderApi/rider/checkRider/"+this.riderCode).then(
          r=>{
            //当前骑手余额
            this.over = r.data.balance
          }
      )
    },
    updateMoney(){
      let rex = /^\d+$/
      if(rex.test(this.newOver) == false){
        this.$message.error("请输入正确的数字")
        this.newOver = ''
      }else {
        this.$axios.post("riderApi/rider/riderGetMoney/"+this.riderCode+"/"+this.newOver).then(
            r =>{
              this.$message(r.data.detail)
              this.showMoney = false
              this.init()
            }
        )
      }
    },
    handleCurrentChang(val) {
      this.code = val.code
    },
    findProduct(){
      this.$axios.get("riderApi/rider/findProduct/"+this.code).then(
          r=>{
            //商品总价
            this.price = r.data.price
            //订单备注
            this.orderNotes = r.data.orderNotes
            //商品集合
            this.productData = r.data.list
            this.dialogVisible1 = true
          }
      )
    },
    formats(row, column, cellValue) {
      cellValue = row.productNum * row.productPrice
      return cellValue
    },
    showSix(){
      this.$axios.get("riderApi/rider/getFinancialInfo/"+this.riderCode).then(
          r=> {
            this.moneyData = r.data
            this.dialogVisible2 = true
          }
      )
    }
    // formats(row,colum,cellValue){
    //   console.log(cellValue)
    //   this.value1=cellValue
    //
    // }
  }
}
</script>

<style scoped>

</style>